<template>
  <view>
    <uni-calendar
      :insert="true"
      :lunar="false"
      :start-date="'2019-3-2'"
      :end-date="'2060-5-20'"
      @change="change"
    />
    <view style="margin: 60upx 30upx">
      <u-button
        style="
          background-color: #18c7e1;
          color: #fff;
          background-color: #18c7e1;
        "
        @tap="appTime"
      >
        预约</u-button
      >
    </view>
    <u-toast ref="uToast" />
  </view>
</template>

<script>
import uniCalendar from "@/components/uni-calendar/uni-calendar.vue";
export default {
  components: { uniCalendar },
  data() {
    return {
      id: "",
      times: "",
    };
  },
  onLoad: function (option) {
    this.id = option.id;
    // //console.log(option.id);
  },
  methods: {
    change(e) {
      // //console.log(e.fulldate);
      this.times = e.fulldate;
    },
    appTime() {
      let self = this;
      uni.showLoading({ title: "加载中", mask: true });
      setTimeout((s) => {
        uni.hideLoading();
      }, 5000);
      this.config
        .post("/oldInfo/appointmentTest", {
          time: this.times,
          planId: this.id,
        })
        .then((res) => {
          uni.hideLoading();
          if (res.data.code === 200) {
            this.$refs.uToast.show({
              title: "预约成功",
              type: "success",
              url: "/pages/main/old/daiban",
            });
          } else {
            if (res.data.code == "-201") {
              self.config.handleError(res.data);
            } else {
              uni.showToast({
                title: self.config.handleError(res.data),
                icon: "none",
              });
            }
          }
        });
    },
  },
};
</script>

<style lang="less" scoped>
.timeChoose {
  margin-top: 50upx;
}
</style>
